import React from 'react';
import { Link } from 'react-router-dom';
import styles from './index.module.less';

/*
* @author TuShun
* @description 页面底部
* @date 2018/10/22 15:52
* @param {}
* @return {}
* */
export default class Footer extends React.Component {
  state = {
    nav: [
      { name: '新手指南', children: null },
      {
        name: '买家中心',
        children: [
          { name: '购物车' },
          { name: '询价单管理' },
          { name: '订单管理' },
          { name: '货品收藏' },
          { name: '货品收藏' },
          { name: '浏览足迹' },
        ],
      },
      {
        name: '卖家中心',
        children: [
          { name: '店铺管理' },
          { name: '商品管理' },
          { name: '订单管理' },
          { name: '物流管理' },
          { name: '评价管理' },
          { name: '发票管理' },
          { name: '数据中心' },
        ],
      },
      { name: '常见问题', children: null },
    ],
    menuList: [
      { name: '关于蜂收部落' },
      { name: '联系我们' },
      { name: '服务条款' },
      { name: '法律声明' },
      { name: '隐私政策' },
      { name: '公告中心' },
      { name: '举报中心' },
      { name: '友情链接' },
    ],
  };

  render() {
    const { nav, menuList } = this.state;

    return (
      <div className={styles.footer}>
        <div className={styles.container}>
          <div className={`${styles.nav} ${styles.clearfix}`}>
            <div className={styles.pullLeft}>
              {nav.map((item, index) => {
                return <div className={styles.box} key={index}>
                  <h3>{item.name}</h3>
                  <ul>
                    {item.children ? item.children.map(
                      (item, index) => {
                        return (
                          <li key={index}>
                            <Link to="/" >{item.name}</Link>
                          </li>
                        );
                      }
                    ) : null}
                  </ul>
                </div>;
              })}
            </div>
            <div className={styles.pullRight}>
              <div className={styles.serviceHotLine}>
                <h3>客服电话</h3>
                <p className={styles.tel}>400-681-6018</p>
                <p>周一至周日 9:30-17:00</p>
                <p>业务在线咨询</p>
                <p>买家专线咨询</p>
                <p>卖家专线咨询</p>
              </div>
              <div className={styles.followUs}>
                <h3>关注我们</h3>
                <div></div>
                <p>蜂收部落官方公众号</p>
              </div>
            </div>
          </div>
          <div className={styles.menu}>
            {menuList.map((item, index) => {
              return (
                <Link key={index} to="/">
                  {item.name}
                </Link>
              );
            })}
          </div>
          <div className={styles.copy}>
            <span>浙ICP备案号xxxxxxxxxxxxx  Copyright©2018 杭州巨擘科技有限公司版权所有</span>
            <span>（JUBO Network Technology Co., Ltd. Hangzhou）</span>
          </div>
        </div>
      </div>
    );
  }
}
